<template>
  <view :style="{height : pageHeight + 'px'}" class="content">
    <tui-loading v-if="loadingTips" :isMask="true"></tui-loading>
    <view class="attractionSelect">
      景点：
      <view class="selectColumn">
        <uni-data-select v-model="selectValue" :localdata="scenicList" @change="changeSelect"></uni-data-select>
      </view>
    </view>
    <!--  组长查看 -->
    <view v-for="(item,index) in dataList" :key="index" class="groupInfoList">
      <view class="groupTitle">
        <view class="groupNum">
          {{ item.name }}
        </view>
        <view style="display: flex; align-items: center; flex: 1;">
          <view class="leader">
            组长：{{ item.leader }}
            <image mode="aspectFit" src="https://echengtuhua.oss-cn-shenzhen.aliyuncs.com/phoneIcon.png">
            </image>
            {{ item.leaderTel }}
          </view>
        </view>

      </view>
      <view class="memberList">
        <view v-for="(ite,index) in item.parties" :key="index"
              :class="[item.parties.role === 1?'memberItem':'leaderItem']">
          <view class="memberInfo">
            <view v-if="ite.role ===1" class="memberTag">
              组员
            </view>
            <view v-if="ite.role ===2" class="leaderTag">
              组长
            </view>
            <view class="memberName">
              <image mode="aspectFit"
                     src="https://echengtuhua.oss-cn-shenzhen.aliyuncs.com/passengerIcon.png"></image>
              {{ ite.name }}
            </view>
            <view class="phone">
              <image mode="aspectFit"
                     src="https://echengtuhua.oss-cn-shenzhen.aliyuncs.com/phoneIcon.png"></image>
              {{ ite.tel }}
            </view>
          </view>
          <view class="taskStatus">
            <view class="status">
              景点：
              <text v-if="item.status>0">已签到</text>
              <text v-else style="color: red;">未签到</text>
            </view>
            <view class="task">
              未完成任务数：
              <text v-if="ite.taskNum===0">{{ ite.unCompleteCount }}</text>
              <text v-else
                    style="color: red;">{{ ite.unCompleteCount }}
              </text>
            </view>
          </view>
        </view>
      </view>
    </view>
    <!-- 组长调整路线 -->
    <view v-if="roles.leader" class="buttomBtn" @tap="toAdjust">
      调整旅行路线
    </view>
    <zy-modal></zy-modal>
  </view>
</template>

<script>
import {
  getGroupInfo
} from '@/api/tourplan.js'
import {
  data
} from 'uview-ui/libs/mixin/mixin';

export default {
  data() {
    return {
      pageHeight: 750,
      itineraryId: 0, //行程id
      scenicList: [],
      scenicId: 0, //景点id
      selectValue: 0,
      dataList: [],
      loadingTips: false,
      groupId: 0,
      roles: {},
    }

  },
  onLoad: function (options) {
    const that = this
    uni.getSystemInfo({
      success: function (res) {
        that.pageHeight = res.windowHeight
      }
    });
    that.initData(options)
  },
  methods: {

    //初始化数据
    initData(options) {
      const that = this
      that.loadingTips = true
      that.itineraryId = options.itineraryId
      that.groupId = options.groupId
      const dataJSON = JSON.parse(decodeURIComponent(options.scenic))
      that.scenicList = this.initSenicData(dataJSON);
      that.roles = JSON.parse(decodeURIComponent(options.rolesJSON))
      that.selectValue = that.scenicList[0].value
      that.getInfoList(that.selectValue)

      // that.getInfoList()
    },
    //获取小组信息
    getInfoList(scenicId) {
      const that = this
      getGroupInfo({
        itineraryId: that.itineraryId,
        scenicId: scenicId,
        tel: uni.getStorageSync('userinfo').phone
      }).then(res => {
        that.dataList = res
        that.loadingTips = false
      }).catch(err => {

      })
    },

    //重组景点数据
    initSenicData(list) {
      const newSenicList = list.map(list => ({
        value: list.id,
        text: list.name
      }))
      return newSenicList
    },

    //切换景点
    changeSelect(e) {
      const that = this
      that.loadingTips = true
      that.selectValue = e
      that.getInfoList(that.selectValue)
    },
    //调整路线
    toAdjust() {
      uni.navigateTo({
        url: '/pages/tourplan/groupInfo/adjustRoute/adjustRoute?groupId=' + this.groupId +
            '&itineraryId=' + this.itineraryId
      })
    }
  }
}
</script>

<style>
@import url("groupInfo.css");
</style>
